.relative{
  position: relative;
}
.absolute{
  position: absolute;
}
.middle{
  vertical-align: middle !important;
}
.baseline{
  vertical-align: baseline !important;
}
.pointer{
  cursor: pointer;
}

/*清除浮动*/
.clear{clear:both; height: 0; line-height: 0; font-size: 0}

.fr{
  float: right;
}
.fl{
  float: left;
}
.of-hide{
  overflow: hidden;
}
.block{
  display: block;
}
.wp100{
  width: 100% !important;
}
.hp100{
  height: 100% !important;
}
.inline-block{
  display: inline-block;
}

.overflow-y{
  overflow-y: auto;
}
.border-box{
  box-sizing: border-box;
}

.overflow-x{
  overflow-x: auto;
  white-space: nowrap;
}
.overflow-h{
  overflow: hidden;
}
.margin-auto{
  margin:0 auto;
}

.mloop(@n, @i: 0) when (@i <=@n) {
  .m@{i} {
    margin: @i * 1px !important;
  }
  .mt@{i} {
    margin-top: @i * 1px !important;
  }
  .mr@{i} {
    margin-right: @i * 1px !important;
  }
  .mb@{i} {
    margin-bottom: @i * 1px !important;
  }
  .ml@{i} {
    margin-left: @i * 1px !important;
  }
  .p@{i} {
    padding: @i * 1px !important;
  }
  .pt@{i} {
    padding-top: @i * 1px !important;
  }
  .pr@{i} {
    padding-right: @i * 1px !important;
  }
  .pb@{i} {
    padding-bottom: @i * 1px !important;
  }
  .pl@{i} {
    padding-left: @i * 1px !important;
  }
  .mloop(@n, (@i + 5));
}

.mloop(80);
